<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>

</body>

<script>
    var menuArr = [
        { id: 1, name: "办公管理", pid: 0 },
        { id: 2, name: "请假申请", pid: 1 },
        { id: 3, name: "出差申请", pid: 1 },
        { id: 4, name: "请假记录", pid: 2 },
        { id: 5, name: "系统设置", pid: 0 },
        { id: 6, name: "权限管理", pid: 5 },
        { id: 7, name: "用户角色", pid: 6 },
        { id: 8, name: "菜单设置", pid: 6 },
    ];

    var getTree = function (data, parentId) {
        var itemArr = []; // 结果数组
        for (let i = 0; i < data.length; i++) {
            var node = data[i]; // 当前节点
            if (node.pid === parentId) {
                var newNode = {
                    id: node.id,
                    title: node.name,
                    children: getTree(data, node.id)
                }
                itemArr.push(newNode);
            }
        }
        return itemArr;
    }
    console.log(getTree(menuArr, 0));
    
</script>


</html>